<template>
    <div>
        <v-header>
            <div class="backs_icon" slot="left"></div>
        </v-header>
        <div class="main_allScroll">
            <ul>
                <li>
                    <span>提现单号</span>
                    <span>{{isProduct ? details.drawbackId : details.recordId}}</span>
                </li>
                <li>
                    <span>提现类型</span>
                    <span v-if="isProduct">{{details.mode == 1 ? '微信' : details.mode == 2 ? '支付宝' : ''}}提现</span>
                    <span v-else>线下提现</span>
                </li>
                <li v-if="!isProduct">
                    <span>到账银行卡</span>
                    <span>{{details.bankCardId}}</span>
                </li>
                <li>
                    <span>提现金额</span>
                    <span>{{details.amount}}</span>
                </li>
                <li>
                    <span>提现时间</span>
                    <span v-if="isProduct">{{details.applyDrawbackTime}}</span>
                    <span v-else>{{details.submitTime}}</span>
                </li>
                <li>
                    <span>状态</span>
                    <span>{{(details.status == 0 || details.status == 10) ? '处理中' : details.status == 1 ? '已到账' : details.status == 2 ? '提现失败': ''}}</span>
                </li>
                <li v-if="isProduct">
                    <span>到账时间</span>
                    <span v-if="details.status == 1">{{details.finishDrawbackTime}}</span>
                    <span v-else>暂未到账</span>
                </li>
                <li>
                    <span>说明</span>
                    <span>{{isProduct ? details.message : details.detail}}</span>
                </li>
            </ul>
        </div>
    </div>
</template>
<script>
    export default {
        name: 'ModeDetail',
        data: function () {
            return {
                isProduct: false,
                details: {}
            }
        },
        activated: function(){
            this.init()
        },
        methods: {
            init(){
                if(this.$route.query.hasOwnProperty('drawbackId')){
                    this.isProduct = true
                    this.queryDrawbackInfo()
                } else {
                    this.isProduct = false
                    this.queryUnderlineDrawbackInfo()
                }
            },
            //  线上提现详情
            queryDrawbackInfo(){
                this.$ajax.finance.queryDrawbackInfo({
                    drawbackId: this.$route.query.drawbackId
                })
                    .then(res => this.details = res.body.content)
            },
            queryUnderlineDrawbackInfo(){
                this.$ajax.finance.queryUnderlineDrawbackInfo({
                    recordId: this.$route.query.recordId
                })
                    .then(res => this.details = res.body.content)
            }
        }
    }
</script>
<style lang="less" scoped>
    .main_allScroll{
        background-color: #fff;
    }
    ul{
        li{
            display: flex;
            justify-content: space-between;
            font-size: 0.3rem;
            color: #888;
            line-height: 3;
            padding: 0 0.32rem 0 0.34rem;
            span:last-child{
                color: #313131;
                display: inline-block;
                max-width: 4.9rem;
            }
            .langText{
                line-height: 2;
            }
        }
    }
</style>